<!DOCTYPE html>  
<html lang="en" dir="ltr">  
<head>  
    <meta charset="utf-8">  
    <title>糖尿病预测系统</title>  
    <link rel="shortcut icon" href="{{ url_for('static', filename='diabetes-favicon.ico') }}">  
    <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='styles.css') }}">  
    <script src="https://kit.fontawesome.com/5f3f547070.js" crossorigin="anonymous"></script>  
    <link href="https://fonts.googleapis.com/css2?family=Pacifico&display=swap" rel="stylesheet">  
</head>  

<body>  
    <div class="container">  
        <h2 class='container-heading'><span class="heading_font">糖尿病预测系统</span></h2>  
        <div class='description'>  
            <p>使用Flask构建，本地部署。</p>  
        </div>  
    </div>  

    <div class="results">  
        {% if prediction==1 %}  
            <h1>预测: <span class='danger'>很遗憾！患者可能患有糖尿病。</span></h1>  
            <img class="gif" src="{{ url_for('static', filename='diabetes.webp') }}" alt="Diabetes Image">  
        {% elif prediction==0 %}  
            <h1>预测: <span class='safe'>恭喜! 患者并未患有糖尿病。</span></h1>  
            <img class="gif1" src="{{ url_for('static', filename='no-diabetes.webp') }}" alt="Not Diabetes Image">  
        {% endif %}  
    </div>  

    <div class="additional-info">
        {% if glucose < 70.8 %}
            <p>血糖值低于正常范围 (最低值 70.8)，低 {{ 70.8 - glucose }} 单位。建议增加碳水化合物摄入，例如吃一些水果或含糖的食物。</p>
        {% elif glucose > 140.4 %}
            <p>血糖值高于正常范围 (最大值 140.4)，高 {{ glucose - 140.4 }} 单位。建议减少碳水化合物和糖分的摄入，增加蔬菜和蛋白质。</p>
        {% endif %}
    
        {% if bloodpressure < 60 %}
            <p>血压值低于正常范围 (最低值 60)，低 {{ 60 - bloodpressure }} 单位。建议增加盐分摄入，保持足够的水分摄入。</p>
        {% elif bloodpressure > 90 %}
            <p>血压值高于正常范围 (最大值 90)，高 {{ bloodpressure - 90 }} 单位。建议减少盐分摄入，多进行有氧运动。</p>
        {% endif %}
    
        {% if skinthickness < 10 %}
            <p>皮肤厚度低于正常范围 (最低值 10)，低 {{ 10 - skinthickness }} 单位。建议增加蛋白质和维生素摄入，保持良好的营养均衡。</p>
        {% elif skinthickness > 50 %}
            <p>皮肤厚度高于正常范围 (最大值 50)，高 {{ skinthickness - 50 }} 单位。建议控制高热量和高脂肪食物的摄入，增加运动和水分摄入。</p>
        {% endif %}
    
        {% if insulin < 135.78 %}
            <p>胰岛素水平低于正常范围 (最低值 135.78)，低 {{ 135.78 - insulin }} 单位。建议规律进餐，控制碳水化合物摄入。</p>
        {% elif insulin > 825.12 %}
            <p>胰岛素水平高于正常范围 (最大值 825.12)，高 {{ insulin - 825.12 }} 单位。建议控制高糖分食物，增加膳食纤维摄入。</p>
        {% endif %}
    
        {% if bmi < 18 %}
            <p>BMI低于正常范围 (最低值 18)，低 {{ 18 - bmi }} 单位。建议增加膳食摄入，选择富含健康脂肪的食物。</p>
        {% elif bmi > 24 %}
            <p>BMI高于正常范围 (最大值 24)，高 {{ bmi - 24 }} 单位。建议控制饮食，增加有氧运动，保持合理的体重。</p>
        {% endif %}
    
        {% if dpf < 0 %}
            <p>糖尿病谱系功能低于正常范围 (最低值 0)，低 {{ 0 - dpf }} 单位。建议增加运动，保持健康的生活作息。</p>
        {% elif dpf > 2 %}
            <p>糖尿病谱系功能高于正常范围 (最大值 2)，高 {{ dpf - 2 }} 单位。建议规律运动，控制甜食和高糖分食物的摄入。</p>
        {% endif %}
    
        {% if age < 0 %}
            <p>年龄低于正常范围 (最低值 0)，低 {{ 0 - age }} 单位。建议保持良好的生活习惯，注意饮食和运动。</p>
        {% elif age > 150 %}
            <p>年龄高于正常范围 (最大值 150)，高 {{ age - 150 }} 单位。建议保持良好的生活习惯，关注心理健康。</p>
        {% endif %}
    </div> 

    <div class="ml-container">  
        <button class="my-cta-button" onclick="downloadResults('txt')">下载结果 (TXT)</button>  
    </div>  

    <div class='footer'>  
        <div class="contact">  
            <a target="_blank" href="https://github.com/anujvyas/Diabetes-Prediction-Deployment"><i class="fab fa-github fa-lg contact-icon"></i></a>  
            <a target="_blank" href="https://www.linkedin.com/in/anujkvyas"><i class="fab fa-linkedin fa-lg contact-icon"></i></a>  
        </div>  
        <p class='footer-description'>联系我们 ❤️ 3188577474@qq.com </p>  
    </div>  

    <script>  
    function downloadResults(format) {
			// Get the predicted results and suggestions content
			var resultsContent = document.querySelector('.results').innerText;
			var suggestionsContent = document.querySelector('.additional-info').innerText;
		
			// Combine the content
			var combinedContent = resultsContent + '\n\n' + suggestionsContent;
		
			// Get the current timestamp
			var timestamp = new Date().toISOString().replace(/:/g, '-').substring(0, 19);
		
			// Create a Blob containing the combined content
			var blob = new Blob([combinedContent], { type: 'text/plain' });
		
			// Create a link element
			var link = document.createElement('a');
		
			// Set the download attribute and file name based on the chosen format and timestamp
			link.download = 'diabetes_results_' + timestamp + '.' + format;
		
			// Create a URL for the Blob and set it as the href attribute
			link.href = URL.createObjectURL(blob);
		
			// Append the link to the document
			document.body.appendChild(link);
		
			// Programmatically click the link to trigger the download
			link.click();
		
			// Remove the link from the document
			document.body.removeChild(link);
		} 
    </script>  
</body>  
</html>